@import "_lib.less";
@import "_reset.less";



.mainmenu { padding: 0; margin: 0; height: 24px; list-style: none; position: relative; background: #444; }
.mainmenu-item { float: left; padding: 4px 7px 5px; margin: 0 7px; border-top: 2px solid transparent; font-size: .9em; text-decoration: none; color: #eee; }
.mainmenu-item-active { font-weight: bold; border-color: #95BDD4; }
.mainmenu-item-right { float: right; }
a.mainmenu-item:hover { background-color: #666; }
span.mainmenu-item { color: #999; }

.mainmenu-icon { width: 16px; height: 16px; background-position: center 2px; background-repeat: no-repeat; }
.mainmenu-icon:active { background-position: center 3px; }

.calendar-nav .button { margin: 0 0 0 -1px; padding: 3px 8px; position: relative; float: left; cursor: pointer; text-align: center; font-size: .9em; color: #444; text-decoration: none;
	border: 1px solid rgba(50, 50, 50, .5); border-radius: 4px; width: auto; .gradient(#f5f5f5,#f1f1f1);
}
.calendar-nav .button:hover { .gradient(#f8f8f8,#f1f1f1); .shadow(0 1px 1px rgba(0,0,0,.1)); }
.calendar-nav .button:active { .gradient(#F6F6F6,#f1f1f1); .shadow(inset 0 1px 2px rgba(0,0,0,.1)); top: 1px; }
.calendar-nav .button-no-text { font-size: 0; padding: 6px 8px; height: 26px;  }
#btnPrevDay { margin-left: 5px; border-top-right-radius: 0; border-bottom-right-radius: 0;  }
#btnNextDay { border-top-left-radius: 0; border-bottom-left-radius: 0; }

.button .icon { width: 7px; height: 12px; display:inline-block; }
.button .icon-left { background: url(../img/icons/l.png) 0 0 no-repeat; }
.button .icon-right { background: url(../img/icons/r.png) 0 0 no-repeat; }



/*** SIDEBAR *************************************************************************************************************************************/
#sidebar { position: absolute; top: 24px; bottom: 0; left: 0; z-index: 10; width: 200px; }
#sidebar #calendar { color: #444; width: 90px; margin: 0 0 0 -7px; float: left; text-align: center; border: 1px solid rgba(50, 50, 50, .5); border-radius: 0 4px 4px 0;  }
#sidebar #projectFilterField { position:relative; z-index: 99; width: 175px; padding: 3px; margin: -1px 0; font: inherit; border: 1px solid #464856; color: #666; background: #ddd url(../img/icons/search.png) 98% 3px no-repeat; }
#sidebar #projectFilterField:focus { border-color: #333; background-color: #eee; }
#sidebar .lists { top: 89px; position: absolute; bottom: 0; right: 0; left: 0; border:none; overflow-y: auto; background: none; padding-bottom: 28px; }
#sidebar .list { margin: 0 0 0 1px; width: 181px; }
#sidebar .list .project { font-size: .8em; padding: 8px 10px; margin: 1px 0 0; background: #ddd; cursor: move; border-left: 3px solid transparent; box-shadow: 0 1px 0 #fff inset; }
#sidebar .list .project:hover { border-color: #95BDD4; }
#sidebar .project .star { float: left; width: 16px; height: 16px; cursor: pointer; margin: -1px 6px 0 -7px; background: url(../img/icons/star.png) 0 0 no-repeat; }
#sidebar .project.fav .star { background-position: 0 bottom; }
#sidebar .project .tags { color: #aaa; display: block; padding: 0 0 0 18px; margin: 4px 0 0 -3px; /* background: url(../img/icons/tag.png) 0 3px no-repeat; */}


body>.project { box-shadow: 0 2px 4px 3px rgba(0,0,0,.5); font-size: 0.8em; padding: 8px 10px; width: 186px; list-style: none; background: rgba(220,220,220,.9); } 
body>.project .star,body>.project .tags { display: none; } 

#sidebar p { color: #aaa; margin: 7px 5px; clear: both; }
#sidebar .link { color: #aaa; font-size: .9em; }
#sidebar .action-link { padding: 4px; margin: 5px 0 0; color: #aaa; font-size: .9em; float: left; clear: both; }
#sidebar .hide-more-projects { bottom: 0; position: fixed; z-index: 1; background: rgba(99,102,122,.9); width: 174px; text-align: center; }
#sidebar .link:hover,
#sidebar .action-link:hover { text-decoration: none; color: #eee; }

#sidebar .calendar-nav { margin: 1px; padding: 9px 0 5px 5px; display: block; color: #ddd; width: 180px; background: #eee; overflow: hidden; }
#sidebar .calendar-nav>label { float: left; width: 50px; clear: left; line-height: 1; height: 18px; padding: 6px 0 0 10px; margin: 0 -2px 3px 0; font-weight: bold; font-size: .9em; color: #666; background: #eee; border: 1px solid rgba(50, 50, 50, .5); border-radius: 3px 0 0 3px; }
#sidebar .calendar-nav>input { float: left; width: 99px; clear:right; line-height: 1; height: 23px; padding: 1px 5px 0; border: 1px solid rgba(50, 50, 50, .5); border-radius: 0 3px 3px 0; color: #444; margin: 0 0 3px; }
#sidebar .calendar-nav>select { float: left; width: 113px; overflow: hidden; border: 1px solid rgba(50, 50, 50, .5); border-radius: 3px; padding: 4px 5px; color: #444; }
#sidebar .calendar-nav .link { color: #999; }
#sidebar .calendar-nav .link:hover { color: #666; }
#sidebar .calendar-nav .user-label { height: 124px; }

#userSelect { float: left; font-size: .9em; }	
#userSelect .checklist { height: 130px !important; }

#projectPlaceholder { margin: 1px 0 0 1px; float: left; box-shadow: 0 0 1px rgba(0, 0, 0, 0.5); border-radius: 2px; }
#projectPlaceholder .project { width: 159px; height: 20px; background-color: #fff; color: #444; font-size: .9em; line-height: 1; padding: 7px 5px 0; border-radius: 2px; }
#projectPlaceholder .empty { color: #ccc; text-align: center; }
/*************************************************************************************************************************************************/



/*** MODAL FORM **********************************************************************************************************************************/
.ui-dialog .form { padding: 15px 0 5px 20px;
	.label, .input { float: left; margin-bottom: 10px; font-size: 1.1em; font: inherit; }
	.label { width: 50px; padding: 4px 5px; clear: left; }
	.input { width: 220px; padding: 3px 4px; }
}

.change-pass-form { margin-bottom: -20px;
	label { display: block; color: #666; font-size: 13px; padding: 0 0 15px; line-height: 1.6; 
		input { float: right; margin-left: 20px; color: #444; border: 1px solid rgba(50, 50, 50, 0.5); border-radius: 4px; padding: 3px 5px; }
	}
}
/*************************************************************************************************************************************************/




/*** MAIN CONTENT ********************************************************************************************************************************/
#wrapper { position: absolute; top: 24px; right: 0; left: 182px; bottom: 0; overflow: hidden; overflow-y: auto; z-index: 10; }
#wrapper .week { margin: 0; position: relative; }

.day { margin: 0 0 0 1px; font-size: 0.9em; }
.day .day-header { padding: 5px 0 0; height: 22px; margin: 0; color: #555; font-size: 13px; font-weight: bold; text-align: center; position: relative;
	text-shadow: 0 1px 0 rgba(255, 255, 255, .3); border: 1px solid #73788E; border-width: 1px 0; box-shadow: inset 0 1px 0 rgba(255,255,255,.4); .gradient(#ccccd9,#aaaab0);
}
.day .day-header .actions { float: right; padding: 1px 2px; }

.day .day-content { border: none; background: #fff; color: #333; width: 100%; border-collapse: collapse; }
.day .day-content td { vertical-align: top; }

.day .row { padding: 0; border-left: 3px solid transparent; }
.day .row:nth-child(even) { background: #f0f0f0; border-color: #f0f0f0; }
.day .row:hover { border-color: #95BDD4; }

.day .project { padding: 7px 10px; min-height: 16px; width: 30%; }
.day .description { padding: 7px 30px 7px 5px; white-space: pre-line; }
.day .actions { width: 78px; padding: 8px 0 2px 0; position: relative; }

.day .row-icon { width: 25px; background-repeat: no-repeat; background-position: 4px 4px; }
.day .row:nth-child(1) .row-icon { background-image: url(../img/icons/type-1.png); }
.day .row:nth-child(2) .row-icon { background-image: url(../img/icons/type-2.png); }
.day .row:nth-child(3) .row-icon { background-image: url(../img/icons/type-3.png); }
.day .row:nth-child(4) .row-icon { background-image: url(../img/icons/type-4.png); }
.day .content-readonly .row:nth-child(4) td { border-bottom: 1px solid #888; }
.day .row:nth-child(5) .row-icon { background-image: url(../img/icons/type-5.png); }
.day .row:nth-child(6) .row-icon { background-image: url(../img/icons/type-6.png); }
.day .row:nth-child(7) .row-icon { background-image: url(../img/icons/type-7.png); }
.day .row:nth-child(8) .row-icon { background-image: url(../img/icons/type-8.png); }


/*** day - actions: copy & paste ***/
.actions .icon { cursor: pointer; border-radius: 3px; display: inline-block; position: relative; width: 16px; height: 16px; margin-right: 7px; opacity: .5; }
.actions .icon:hover { opacity: 1 }
.actions .icon:active { top: 1px; }

.icon-copy { background: url(../img/icons/copy.png) 0 0 no-repeat; }
.icon-paste { background: url(../img/icons/paste.png) 0 0 no-repeat; }
.icon-save { background: url(../img/icons/accept.png) 0 0 no-repeat; }
.icon-clear { background: url(../img/icons/clear-left.png) 0 1px no-repeat; }
.icon-cancel { background: url(../img/icons/cancel.png) 0 0 no-repeat; }
.icon-delete { background: url(../img/icons/delete.png) 0 0 no-repeat; }
.icon-resetpass { background: url(../img/icons/lock_open.png) 0 0 no-repeat; }
.icon-password { background-image: url(../img/icons/lock.png); opacity: .6; }
.icon-weekends { background-image: url(../img/icons/weekends.png); opacity: .6; }
.icon-weekends-on { background-image: url(../img/icons/weekends-on.png); opacity: 1; }



/*** day buttons: save & cancel ***/
.day .buttons { position: absolute; padding: 2px 2px 0; display: none; top: 2px; right: 90px;
	border: 1px solid #73788E; border-bottom:none; background: #eee; border-radius: 5px 5px 0 0; box-shadow: 0 1px 1px rgba(0, 0, 0, .2) inset; 
}
.today .buttons { background-color: #FFFFC0; }



/*** drag & drop ***/
.drop-ready .project { background: #ffffa0 !important; }
.drop-hover .project { background: #95BDD4 !important; }





/*** IN EDIT ***/
.in-edit .actions { visibility: visible; }
.in-edit .row-icon { background-position: 4px 2px; }

.day .editable-clone { background: #eee; border-collapse: separate; }
.editable-clone .actions { visibility: visible; }
.editable-clone .project { border: 1px solid #999; padding: 5px 5px 5px 8px; background: #fff; }
.editable-clone .empty { background: #fff; color: #ccc;  }
.editable-clone .description { padding: 0 10px 0 0; }
.editable-clone .description textarea { font: inherit; color: #4F4F4F; border: 1px solid #999; width: 100%; height: 27px; margin: 0; float: left; }

.project .remove-project { width: 12px; height: 12px; float: right; margin: 2px 0 0; position: relative; background: url(../img/icons/close.png) 0 0 no-repeat; opacity: .7; }
.project .remove-project:hover { opacity: 1; }
.project .remove-project:active { top: 1px; }
.editable-clone .project .remove-project { margin: 4px 0 0; }
/*************************************************************************************************************************************************/




/*** PROJECT LOG *********************************************************************************************************************************/
#btnRefresh { float: right; margin: 5px 9px 0 0; }
.project-log #sidebar .calendar-nav { height: 220px;  }
.project-log #sidebar .lists { top: 259px;  }
.project-log .day .project { width: 20%; }

/* colors for row types */
.project-log .day .type-spacer { background: #888; padding: 1px 0 0; }
.project-log .day .type-spacer-bold { padding: 2px 0 0; }

.project-log .day .row .description { padding-right: 5px; }
.project-log .day .row td { border-bottom: none; }
.project-log .day .row .row-icon { background-image: none; }
.project-log .day .row-type-1-img .row-icon { background-image: url(../img/icons/type-1.png); }
.project-log .day .row-type-2-img .row-icon { background-image: url(../img/icons/type-2.png); }
.project-log .day .row-type-3-img .row-icon { background-image: url(../img/icons/type-3.png); }
.project-log .day .row-type-4-img .row-icon { background-image: url(../img/icons/type-4.png); }
.project-log .day .row-type-5-img .row-icon { background-image: url(../img/icons/type-5.png); }
.project-log .day .row-type-6-img .row-icon { background-image: url(../img/icons/type-6.png); }
.project-log .day .row-type-7-img .row-icon { background-image: url(../img/icons/type-7.png); }
.project-log .day .row-type-8-img .row-icon { background-image: url(../img/icons/type-8.png); }

.project-log .day .row:nth-child(even) { background: none; border-color: none; }
.project-log .day .row.even { background: #f0f0f0; border-color: #f0f0f0; }

.project-log .week-stats { font-size: 12px; margin: 0 1px; overflow: hidden; }
.project-log .week-stats .stats-box { background: #fff; margin: 1px; float: left; width: 240px; min-height: 35px; padding: 10px; }
.project-log .week-stats .stats-box ul { margin: 0; padding: 2px 0 0 20px; }
/*** PROJECT LOG *********************************************************************************************************************************/





/*** PROJECT STATS *******************************************************************************************************************************/
.project-stats #sidebar .calendar-nav { height: 57px;  }
.project-stats #sidebar .lists { top: 96px;  }
#chart0, #chart1, #chart2 { background: #DDDDDD; border: 1px solid #000; border-width: 1px 0 1px 1px; height: 400px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
#chart0 { border-width: 1px 0 0 1px; }
#chart1, #chart2 { width: 50%; float: left; }
/*** PROJECT STATS *******************************************************************************************************************************/



/*** USER STATS **********************************************************************************************************************************/
.user-stats #sidebar .calendar-nav .user-label { height: 242px; }
.user-stats #userSelect .checklist { height: 250px !important; }	
/*** USER STATS **********************************************************************************************************************************/
